import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:live_music/components/ui/theme.dart';
import 'package:live_music/models/notification_detail_model.dart';
import 'package:live_music/models/user_info_model.dart';
import 'package:live_music/pages/other/click_see_other.dart';
import 'package:live_music/services/userService.dart';
import 'package:live_music/utils/util.dart';

class FollowCard extends StatefulWidget {
  FollowCard({Key key, this.index, this.notificationItem, this.addFollowed})
      : super(key: key);
  final int index;
  final Function addFollowed;
  final NotificationDetailModel notificationItem;
  @override
  _FollowCardState createState() => _FollowCardState();
}

class _FollowCardState extends State<FollowCard>
    with SingleTickerProviderStateMixin {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 12),
      margin: const EdgeInsets.only(top: 24),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          InkWell(
              child: CircleAvatar(
                radius: 25,
                backgroundImage:
                    NetworkImage(widget.notificationItem.moment.userAvatarUrl),
              ),
              onTap: () {
                Get.to(PageViewOther(
                    userId: widget.notificationItem.moment.userId));
              }),
          Expanded(
            child: Container(
              padding: const EdgeInsets.only(bottom: 15),
              margin: const EdgeInsets.only(left: 24),
              decoration: BoxDecoration(
                border: Border(
                  bottom: BorderSide(
                    width: .5,
                    color: WcaoTheme.placeholder.withOpacity(.5),
                  ),
                ),
              ),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Text(
                        widget.notificationItem.moment.userName,
                        style: TextStyle(
                          fontSize: 14,
                          fontWeight: FontWeight.bold,
                        ),
                      )
                    ],
                  ),
                  Container(
                    margin: const EdgeInsets.only(top: 4),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Expanded(
                          child: Container(
                            padding: const EdgeInsets.only(right: 24),
                            child: Text(
                              getDateTime(widget.notificationItem.createTime),
                              overflow: TextOverflow.ellipsis,
                              style: TextStyle(
                                color: WcaoTheme.secondary,
                                fontSize: 12,
                              ),
                            ),
                          ),
                        )
                      ],
                    ),
                  )
                ],
              ),
            ),
          ),
          Container(
              height: 30,
              width: !widget.notificationItem.moment.hasFollowed ? 60 : 70,
              margin: EdgeInsets.only(left: 10),
              alignment: Alignment.center,
              child: ElevatedButton(
                  style: ButtonStyle(
                      elevation: MaterialStateProperty.all(0),
                      shape: MaterialStateProperty.all(RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(20))),
                      backgroundColor: MaterialStateProperty.all(
                        !widget.notificationItem.moment.hasFollowed
                            ? Colors.redAccent
                            : Colors.white,
                      )),
                  onPressed: () {
                    onTapLikeButton(
                        !widget.notificationItem.moment.hasFollowed);
                  },
                  child: Center(
                    child: Text(
                      !widget.notificationItem.moment.hasFollowed
                          ? '关注'
                          : "已关注",
                      style: TextStyle(
                          color: !widget.notificationItem.moment.hasFollowed
                              ? Colors.white
                              : Colors.grey,
                          fontSize: 12,
                          fontWeight: FontWeight.w500),
                    ),
                  )))
        ],
      ),
    );
  }

  Future<bool> onTapLikeButton(bool isLiked) async {
    Map<String, dynamic> data = {
      "targetId": widget.notificationItem.moment.userId,
      "targetType": 'USER',
    };
    if (isLiked) {
      await UserService.follow(data);
    } else {
      await UserService.cancelFollow(data);
    }
    widget.addFollowed(isLiked, widget.index);
    return isLiked;
  }
}
